<template>
  <div class="contarner-page" @click.stop="showLanguageHandel">
    <page-header ref="languageRef"></page-header>
    <main>
      <div class="downloader flex_ccenter" v-if="!success">
        <div class="container">
          <div class="banner-heading flex_ccenter">
            <div class="heading-item">
              <h1 class="title fw700 f-42 c-fff">
                تحميل فيديوهات انستقرام ريلز
              </h1>
              <h2 class="sub c-fff f-18 fw400">
                Instagram - بكرات تنزيل الفيديو
              </h2>
            </div>
          </div>
          <div class="form flex_center">
            <div class="input-box flex_between">
              <!-- <input
                    type="text"
                    class="input f-18"
                    v-model="input"
                    @input="handleInput"
                    @paste="handleInput"
                    placeholder="Paste URL Instagram"
                    list="fruits"
                    name="fruit"
                  />
                  <datalist id="fruits">
                    <option value="Apple"></option>
                    <option value="Banana"></option>
                    <option value="Cherry"></option>
                  </datalist> -->
              <input
                type="text"
                class="input f-18"
                v-model="input"
                :disabled="isHttpLoading"
                @input="handleInput"
                @paste="handleInput"
                @keydown="sendDownload($event)"
                placeholder="Paste URL Instagram"
              />
              <div
                class="Paste shou flex_center"
                @click="handleClickPasted"
                v-if="input == ''"
              >
                <div class="btnbg"></div>
                <div class="f-16 c-000 fw700">Paste</div>
              </div>
              <div
                class="clear shou flex_center"
                v-if="input != '' && !isHttpLoading"
                @click.stop="input = ''"
              >
                <div class="btnbg"></div>
                <div class="f-16 c-000 fw700">Clear</div>
              </div>
            </div>
            <div
              v-if="!isHttpLoading"
              @click.stop="downloadHandel"
              class="submit shou fw700 c-fff flex_center"
            >
              Download
            </div>
            <div v-else class="submit shou fw700 c-fff flex_center">
              Please wait
            </div>
          </div>
          <div class="app-submit flex_ccenter">
            <div
              class="submit flex_center"
              v-if="!isHttpLoading"
              @click.stop="downloadHandel"
            >
              <div class="fw700 c-fff f-21">Download</div>
            </div>
            <div class="submit flex_center" v-else>
              <div class="fw700 c-fff f-21">Please wait</div>
            </div>
          </div>
          <div class="loading" v-if="isHttpLoading">
            <div class="loading-dots flex_center">
              <div class="dot"></div>
              <div class="dot"></div>
              <div class="dot"></div>
              <div class="dot"></div>
            </div>
            <div class="tips f-18 flex_center">
              <div>جارٍ استرداد البيانات، يرجى الانتظار بضع ثوانٍ!</div>
            </div>
          </div>
          <div class="error flex_ccenter" v-if="httpError1">
            <div class="hono flex_">
              <div class="error-img"></div>
              <div class="error-img"></div>
              <div class="error-img"></div>
            </div>
            <div class="errMsg f-18">
              لا يستطيع الموقع معالجة الرابط الخاص بك لأنه خاص
            </div>
          </div>
          <div class="error flex_ccenter" v-if="httpError2">
            <div class="hono flex_">
              <div class="error-img"></div>
              <div class="error-img"></div>
              <div class="error-img"></div>
            </div>
            <div class="errMsg f-18">
              البيانات التي أدخلتها ليست رابطا، يرجى إدخال رابط صالح لها مثال:
              <div>https://www.instagram.com/reel/Cml9qu-ISqx</div>
            </div>
          </div>
        </div>
      </div>
      <!-- 广告位start -->
      <!-- 广告位end -->
      <div class="container" v-if="!success">
        <div class="body-content">
          <div class="app-box Reverse">
            <div class="app-box__info Reverse">
              <h3
                class="app-box__title f-21 fw700 c-000"
                style="text-align: right"
              >
                قم بالتنزيل باستخدام تطبيق Insta Downloader
              </h3>
              <p class="f-16 c-ccc" style="text-align: right">
                يقدم تطبيقنا حلاً سريعًا وبسيطًا لتنزيل مقاطع فيديو Instagram،
                مما يوفر مقاطع فيديو عالية الجودة بدون علامات مائية.
              </p>
            </div>
            <div class="app-link">
              <a
                target="_blank"
                href="https://play.google.com/store/apps/details?id=ins.freevideodownload.pro"
              >
                <img
                  src="/static/images/google-play.webp"
                  alt="Download app "
                />
              </a>
              <a
                href="https://apps.apple.com/us/app/repost-for-video-save-story/id6462401460"
                target="_blank"
              >
                <img src="/static/images/IOS.webp" alt="Download app " />
              </a>
            </div>
          </div>
          <div class="quick-info Reverse">
            <h3 class="f-32 c-000">ماذا يعني Reels على Instagram؟</h3>
            <p class="f-16 c-ccc">
              مع احتمالين للطول — 15 أو 30 ثانية — Instagram Reels هي ميزة جديدة
              تتيح لك إنتاج أفلام قصيرة. بكرات يجمع ميزات التحرير المذهلة في
              Instagram مع بعض ميزات Tiktok الميزات، ومع ذلك فهي لا تزال مثيرة
              عندما يستخدمها المستخدمون. يمكن للمستخدمين أنشئ أفلامًا أصلية عن
              طريق تحرير وتصميم مقاطع فيديو جذابة.
            </p>
          </div>
          <div class="features c-fff Reverse">
            <h3 class="h3 fw700 f-21">مميزات برنامج تحميل Instagram Reels</h3>
            <div class="attributes-list flex_between">
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  طريقة سريعة وبسيطة وآمنة لتنزيل Instagram Reels.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  يمكنك الوصول إلى حساب Instagram الخاص بك دون تسجيل الدخول.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  ما عليك سوى النقر على زر في Instagram يسمح لك بذلك تحميل الصور
                  ومقاطع الفيديو الخاصة به.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  قم بتنزيل الصور ومقاطع الفيديو وحفظها بأصلها الجودة والقرار.
                </div>
              </div>
              <div class="item flex_">
                <div class="bgimg"></div>
                <div class="f-14 c-fff">
                  من الحسابات الشخصية، قم بتنزيل وحفظ Instagram Reels.
                </div>
              </div>
            </div>
          </div>
          <div class="how Reverse">
            <div class="how-title">
              <h3 class="f-36 c-000 italic">
                هل من الممكن استخدام Savinginsta لتنزيل مقاطع الفيديو من بكرات
                انستقرام؟
              </h3>
            </div>
            <div class="steps">
              <div class="step">
                <div class="one">
                  <span class="fw700 c-blue f-16">الخطوة 01:</span>
                  <span class="f-16 c-000">
                    انتقل إلى منشور Instagram الذي ترغب في تنزيله، ثم حدد فيديو
                    بكرات.</span
                  >
                </div>
              </div>
              <div class="step">
                <span class="fw700 c-blue f-16">الخطوة 02:</span>
                <span class="f-16 c-000">
                  حاليًا، انسخ عنوان URL الخاص بفيديو Instagram Reels.</span
                >
              </div>
              <div class="step">
                <span class="fw700 c-blue f-16">الخطوة 03:</span>
                <span class="f-16 c-000"
                  >انسخ عنوان URL من Instagram، والصقه في Savinginsta شريط
                  الأدوات، ثم اضغط على "تنزيل".</span
                >
              </div>
            </div>
            <div class="user-note f-16">
              <div class="app-tip"></div>
              <p>
                يمكن تنزيل الأفلام والصور التي تم تحميلها على حسابك بمساعدة
                أدواتنا. إذا كنت تستخدم أدواتنا لانتهاك الملكية الفكرية أو
                الخصوصية للآخرين، فإننا نحتفظ بالحق في ذلك رفض تقديم خدماتنا.
              </p>

              <a class="fw700 c-blue" href="/terms-of-service"
                >انقر هنا لعرض شروط الخدمة الكاملة لدينا.</a
              >
            </div>
          </div>
          <div class="faq-section">
            <h3 class="faq-title f-36 c-000 italic">FAQ</h3>
            <div class="accordion Reverse">
              <div
                id="faq"
                itemscope="itemscope"
                itemtype="https://schema.org/FAQPage"
              >
                <div
                  itemprop="mainEntity"
                  itemscope="itemscope"
                  itemtype="https://schema.org/Question"
                  class="accordion-item"
                  :key="k"
                  v-for="(item, k) in faqList"
                >
                  <h4 itemprop="name" class="accordion-title fw700 f-16">
                    {{ item.title }}
                  </h4>
                  <div
                    itemprop="acceptedAnswer"
                    itemscope=""
                    itemtype="https://schema.org/Answer"
                  >
                    <div
                      itemprop="text"
                      class="accordion-text f-16 c-ccc fw400"
                    >
                      {{ item.content }}
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 解析结果 start -->
      <div class="container" v-if="success">
        <success-content
          @refresh="refresh"
          :list="successList"
        ></success-content>
      </div>
      <!-- 解析结果 end -->
    </main>
    <footer>
      <div class="container">
        <div class="footer-content Reverse">
          <div class="footer-link">
            <div class="row flex_between">
              <div class="col-12">
                <div class="link-label fw700 c-000 f-21">أدوات</div>
                <ul class="list-unstyled c-ccc f-16">
                  <li>
                    <nuxt-link to="/ar/instagram-story-download"
                      >تنزيل قصة الانستقرام</nuxt-link
                    >
                  </li>
                  <li>
                    <nuxt-link to="/ar/instagram-reels-video-download"
                      >تحميل بكرات الانستقرام</nuxt-link
                    >
                  </li>
                  <li>
                    <a href="https://savingtik.com/" target="_blank"
                      >تنزيل تيك توك</a
                    >
                  </li>
                </ul>
              </div>
              <div class="col-6">
                <div class="link-label fw700 c-000 f-21">يدعم</div>
                <ul class="list-unstyled c-ccc f-16">
                  <li>
                    <nuxt-link to="/contact"> اتصال </nuxt-link>
                  </li>
                  <li>
                    <nuxt-link to="/blog"> Blog </nuxt-link>
                  </li>
                </ul>
              </div>
              <div class="col-6">
                <div class="link-label fw700 c-000 f-21">قانوني</div>
                <ul class="list-unstyled c-ccc f-16">
                  <li>
                    <nuxt-link to="/terms-of-service"> شروط الخدمة </nuxt-link>
                  </li>
                  <li>
                    <nuxt-link to="/privacy-policy"> سياسة الخصوصية </nuxt-link>
                  </li>
                </ul>
              </div>
            </div>
          </div>
          <div class="copyright flex_ccenter">
            <b class="fw700 f-21 c-000">نحن لسنا تابعين لـ Instagram أو Meta</b>
            <div class="c-ccc f-16">
              © {{new Date().getFullYear()}} Insta Downloader All rights reserved.
            </div>
          </div>
        </div>
      </div>
    </footer>
  </div>
</template>
    
<script>
import { mapState, mapGetters, mapMutations } from "vuex";
import pageHeader from "~/components/page-header.vue";
import SuccessContent from "~/components/success-content.vue";
import CryptoJS from "crypto-js";
import { handleClick, checkString } from "@/plugins/Firebase.js";
export default {
  components: { pageHeader, SuccessContent },
  head: {
    htmlAttrs: {
      lang: "ar",
    },
    bodyAttrs: {
      "data-lang": "ar",
    },
    title: "Instagram Reels تنزيل الفيديو - Savinginsta",
    meta: [
      { property: "og:locale", content: "ar" },
      //Page Information
      {
        name: "description",
        content:
          "مع برنامج Savinginsta Reels Video Downloader، أصبح تنزيل Instagram Reels أمرًا في غاية السهولة! استمتع بتنزيلات فيديو سريعة ومجانية وعالية الجودة مباشرةً على جهازك",
      },

      //Schema.org Microdata
      {
        itemprop: "name",
        content: "Instagram Reels تنزيل الفيديو - Savinginsta",
      },

      // Facebook / OpenGraph
      {
        property: "og:title",
        content: "Instagram Reels تنزيل الفيديو - Savinginsta",
      },
      { property: "og:type", content: "website" },
      {
        property: "og:url",
        content: "https://savinginsta.com/ar/instagram-reels-video-download",
      },

      {
        property: "og:description",
        content:
          "مع برنامج Savinginsta Reels Video Downloader، أصبح تنزيل Instagram Reels أمرًا في غاية السهولة! استمتع بتنزيلات فيديو سريعة ومجانية وعالية الجودة مباشرةً على جهازك",
      },
      //Twitter
      { name: "twitter:card", content: "summary" },
      {
        name: "twitter:url",
        content: "https://savinginsta.com/ar/instagram-reels-video-download",
      },
      {
        name: "twitter:title",
        content: "Instagram Reels تنزيل الفيديو - Savinginsta",
      },
      {
        name: "twitter:description",
        content:
          "مع برنامج Savinginsta Reels Video Downloader، أصبح تنزيل Instagram Reels أمرًا في غاية السهولة! استمتع بتنزيلات فيديو سريعة ومجانية وعالية الجودة مباشرةً على جهازك",
      },
      //multilingual
      {
        name: "google",
        content: "notranslate",
      },
    ],
    link: [
      //multilingual
      {
        rel: "alternate",
        hreflang: "x-default",
        href: "https://savinginsta.com/ar/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "en",
        href: "https://savinginsta.com/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "en-in",
        href: "https://savinginsta.com/in/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "vi",
        href: "https://savinginsta.com/vn/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "tr",
        href: "https://savinginsta.com/tr/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "id",
        href: "https://savinginsta.com/id/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "fr",
        href: "https://savinginsta.com/fr/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "pt",
        href: "https://savinginsta.com/pt/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "ru",
        href: "https://savinginsta.com/ru/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "es",
        href: "https://savinginsta.com/es/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "ms",
        href: "https://savinginsta.com/ms/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "ko",
        href: "https://savinginsta.com/ko/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "ja",
        href: "https://savinginsta.com/ja/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "jv",
        href: "https://savinginsta.com/jv/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "cs",
        href: "https://savinginsta.com/cs/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "de",
        href: "https://savinginsta.com/de/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "it",
        href: "https://savinginsta.com/it/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "pl",
        href: "https://savinginsta.com/pl/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "hu",
        href: "https://savinginsta.com/hu/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "nl",
        href: "https://savinginsta.com/nl/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "ro",
        href: "https://savinginsta.com/ro/instagram-reels-video-download",
      },
      {
        rel: "alternate",
        hreflang: "el",
        href: "https://savinginsta.com/el/instagram-reels-video-download",
      },
      {
        rel: "canonical",
        href: "https://savinginsta.com/ar/instagram-reels-video-download",
      },
    ],
    script: [
      {
        json: {
          "@context": "http://schema.org",
          "@graph": [
            {
              "@type": "WebSite",
              name: "Savinginsta",
              alternateName: "Instagram downloader",
              url: "https://savinginsta.com",
            },
            {
              "@type": "WebPage",
              name: "Instagram Reels تنزيل الفيديو - Savinginsta", //title
              inLanguage: "ar", //不同语种
              description:
                "مع برنامج Savinginsta Reels Video Downloader، أصبح تنزيل Instagram Reels أمرًا في غاية السهولة! استمتع بتنزيلات فيديو سريعة ومجانية وعالية الجودة مباشرةً على جهازك.", //元描述
              image:
                "https://savinginsta.com/static/images/savinginsta_thumbnail.jpg", //绝对路径
              url: "https://savingtinsta.com/ar/instagram-reels-video-download",
            },
          ],
        },
        type: "application/ld+json",
      },
    ],
  },
  data() {
    return {
      input: "",
      success: false,
      isHttpLoading: false,
      httpError1: false,
      httpError2: false,
      current: 0,
      successList: [],
      faqList: [
        {
          title: `هل يتطلب تنزيل Reels تسجيل الدخول؟`,
          content: `لحسن الحظ، يمكنك تسجيل الخروج من حسابك. تنزيله بسيط وآمن بالنسبة لك.`,
        },
        {
          title: `هل مقاطع الفيديو من Instagram Reels غير قانونية للتنزيل؟`,
          content: `يمكن تنزيل مقاطع الفيديو من Insta Reels. ومع ذلك، يجب عليك التواصل مع مالك الفيديو إذا كنت تستخدمه لتحقيق الربح أو لأي سبب آخر يتعلق بحقوق المالك. بالنسبة للمخاوف المتعلقة بحقوق النشر، فإن Savinginsta ليس مسؤولاً.`,
        },
        {
          title: `هل تتطلب مقاطع فيديو Instagram Reels الدفع ليتم تنزيلها؟`,
          content: `مجانا للجميع. يتم إدراج الإعلانات فقط لصيانة الخادم وتحسين المنتج.`,
        },
        {
          title: `هل تنزيلاتي لمقاطع فيديو Instagram محدودة؟`,
          content: `من الواضح أنه مجاني ومتاح للتنزيلات غير المقيدة.`,
        },
        {
          title: `ما هو موقع مقاطع فيديو Instagram التي تم تنزيلها؟`,
          content: `مجلد التنزيل هو المكان الذي يتم فيه حفظه غالبًا على الهواتف. لعرض سجل التنزيلات على جهاز الكمبيوتر الخاص بك، استخدم Ctrl + J.`,
        },
      ],
    };
  },
  computed: {
    ...mapGetters(["language"]),
  },
  mounted() {
    this.debouncedDownInput = this.debounce(this.downInput, 1000);
  },
  methods: {
    async downloadHandel() {
      if (this.isHttpLoading || this.input === "") return;
      this.isHttpLoading = false;
      this.httpError1 = false;
      this.httpError2 = false;
      this.input = this.input.replace(/^.*\s?https:\/\//, "https://");
      let type = checkString(this.input);
      const insUrlPattern = new RegExp("^http(s|)://.*instagram.com.*/.*$");
      if (!insUrlPattern.test(this.input)) {
        //点击解析下载按钮
        handleClick("action_ins_detect_boinsom", {
          site: "other",
          noislink: this.input,
          from: "reel",
          type: type,
        });
        this.httpError2 = true;
        this.isHttpLoading = false;
        return;
      }
      //点击解析下载按钮
      handleClick("action_ins_detect_boinsom", {
        site: "other",
        from: "reel",
        type: type,
      });
      //开始解析  ins_start_resolve
      handleClick("ins_start_resolve", {
        islink: this.input,
        from: "reel",
        type: type,
      });
      this.isHttpLoading = true;
      try {
        let result = this.uki(this.input);
        const response = await fetch(
          "https://savinginsta.com/api/downloader/analysis",
          {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({
              path: result,
            }),
          }
        );
        let encryptedResponse = await response.text();
        let parse = JSON.parse(encryptedResponse);
        if (parse.code != 200) {
          // 解析失败  ins_resolve_fail
          handleClick("ins_resolve_fail", {
            reason: "Failed to fetch",
            islink: this.input,
            from: "reel",
            type: type,
          });
          this.httpError1 = true;
          this.isHttpLoading = false;
          return;
        } else {
          //解析成功  ins_resolve_success
          handleClick("ins_resolve_success", {
            type: type,
            from: "reel",
          });
          let decryptedResponse = await this.eki(parse.data); // 使用你的解密函数
          this.successList = JSON.parse(decryptedResponse);
          this.success = true;
          this.isHttpLoading = false;
        }
      } catch (error) {
        // 解析失败  ins_resolve_fail
        handleClick("ins_resolve_fail", {
          reason: "Failed to fetch",
          islink: this.input,
          from: "reel",
          type: type,
        });
        console.error(error);
        this.httpError1 = true;
        this.isHttpLoading = false;
      }
    },

    uki(input) {
      let CIPHER_ALGORITHM = "DES-CBC";
      let IV_SIZE = 8;

      try {
        const complexKey = [
          process.env.part1,
          process.env.part2,
          process.env.part3,
          process.env.part4,
          process.env.part5,
          process.env.part6,
          process.env.part7,
          process.env.part8,
        ].join("");
        const keyBytes = CryptoJS.enc.Utf8.parse(complexKey);
        const inputBytes = CryptoJS.enc.Utf8.parse(input);
        const ivBytes = CryptoJS.lib.WordArray.random(IV_SIZE);
        const encrypted = CryptoJS.DES.encrypt(inputBytes, keyBytes, {
          iv: ivBytes,
          mode: CryptoJS.mode.CBC,
          padding: CryptoJS.pad.Pkcs7,
        });
        const ciphertext = ivBytes.concat(encrypted.ciphertext);
        return ciphertext.toString();
      } catch (error) {
        console.error(error);
        return null;
      }
    },
    eki(cipherText) {
      let CIPHER_ALGORITHM = "DES-CBC";
      let IV_SIZE = 8;

      const complexKey = [
        process.env.part1,
        process.env.part2,
        process.env.part3,
        process.env.part4,
        process.env.part5,
        process.env.part6,
        process.env.part7,
        process.env.part8,
      ].join("");
      try {
        let keyBytes = CryptoJS.enc.Utf8.parse(
          complexKey.padEnd(CIPHER_ALGORITHM === "DES-CBC" ? 8 : 16)
        );
        let ivBytes = { iv: CryptoJS.enc.Hex.parse(process.env.DES_IV) }; // 如果使用CBC模式，需要一个初始化向量iv，这里是空向量
        let decrypted = CryptoJS.DES.decrypt(
          { ciphertext: CryptoJS.enc.Hex.parse(cipherText) },
          keyBytes,
          ivBytes
        );
        return decrypted.toString(CryptoJS.enc.Utf8);
      } catch (e) {
        console.error(e);
        return null;
      }
    },
    sendDownload(event) {
      if (event.keyCode === 13 && !this.isHttpLoading) {
        this.downloadHandel();
        event.preventDefault();
        return false;
      }
    },
    changeTab(k) {
      this.current = k;
    },
    handleInput(e) {
      this.debouncedDownInput(e);
    },
    debounce(fn, delay) {
      let timer;
      return function () {
        let context = this;
        let args = arguments;
        clearTimeout(timer);
        timer = setTimeout(() => {
          fn.apply(context, args);
        }, delay);
      };
    },
    downInput(e) {
      let type = checkString(e.target.value);
      // 粘贴链接到输入框 action_ins_paste
      handleClick("action_ins_paste", {
        islink: e.target.value,
        from: "reel",
        type: type,
      });
    },
    handleClickPasted() {
      if (!navigator.clipboard) {
        console.log("Clipboard API not available");
        return;
      }
      navigator.clipboard
        .readText()
        .then((text) => {
          this.input = text;
          let type = checkString(text);
          // 粘贴链接到输入框 action_ins_paste
          handleClick("action_ins_paste", {
            islink: text,
            from: "reel",
            type: type,
          });
        })
        .catch((err) => {
          console.error("Failed to read clipboard contents: ", err);
        });
    },
    showLanguageHandel() {
      this.$refs.languageRef.close();
    },
    refresh() {
      this.success = false;
      this.input = "";
      this.successList = [];
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/static/style/reels.css";
.loading {
  .loading-dots {
    position: relative;
    z-index: 999;
    margin-top: 70px;
  }

  .dot {
    background-color: #ffffff;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 0 10px;
    animation: loading-animation 1.5s infinite;
  }

  .dot:nth-child(2) {
    animation-delay: 0.5s;
  }

  .dot:nth-child(3) {
    animation-delay: 0.8s;
  }
  .dot:nth-child(4) {
    animation-delay: 1s;
  }
}
@keyframes loading-animation {
  0%,
  50%,
  80%,
  100% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.5);
  }
}
.features {
  .bgimg {
    margin: 0;
    margin-left: 10px !important;
  }
}
@media (max-width: 768px) {
  .features {
    .bgimg {
      margin: 0 !important;
    }
  }
  .loading {
    .loading-dots {
      margin-top: 26px !important;
    }
    .dot {
      width: 8px !important;
      height: 8px !important;
    }
  }
}
</style>
    